<template>
  <uni-page-wrapper>
    <uni-page-body>
      <uni-popup ref="popup2" type="dialog">
        <uni-popup-dialog
          type="info"
          :title="popup2Title"
          :before-close="true"
          @close="close2"
          @confirm="confirm2"
        >
          <input type="text" />
        </uni-popup-dialog>
      </uni-popup> 
      <uni-popup ref="popup" type="dialog">
        <uni-popup-dialog
          type="info"
          :title="popupTitle"
		  :content="bd"
          :before-close="true"
          @close="close"
          @confirm="confirm"
        >
          <input type="text" />
        </uni-popup-dialog>
      </uni-popup>
      <uni-view class="bg">
        <uni-view class="title">
          <uni-view class="l">{{$t("withdraw.Withdrawal requires a handling fee")}}</uni-view>
          <uni-view class="r">{{ requires }}%</uni-view>
        </uni-view>
        <uni-input class="input">
          <div class="uni-input-wrapper">
            <input
              :placeholder='$t("withdraw.Please enter the withdrawal amount")'
              maxlength="140"
              step=""
              enterkeyhint="done"
              autocomplete="off"
              type=""
              class="uni-input-input"
              :value="withdrawalAmount"
              @input="onKeyInput('withdrawalAmount', $event)"
            />
          </div>
        </uni-input>
        <uni-view class="list">
          <uni-view class="item">
            <uni-view class="l">{{$t("withdraw.Name")}}</uni-view>
            <uni-view class="r">{{ name }} </uni-view>
          </uni-view>
          <uni-view class="item">
            <uni-view class="l">{{$t("withdraw.Account no")}}</uni-view>
            <uni-view class="r"> {{ accountNo }}</uni-view>
          </uni-view>
          <uni-view class="item">
            <uni-view class="l">{{$t("withdraw.Bank")}}</uni-view>
            <uni-view class="r"> {{ bank }}</uni-view>
          </uni-view>
          <uni-view class="item">
            <uni-view class="l">{{$t("withdraw.Ifsc code")}}</uni-view>
            <uni-view class="r">{{ ifscCode }} </uni-view>
          </uni-view>
          <uni-view class="item">
            <uni-view class="l">{{$t("withdraw.transaction password")}}</uni-view>
            <uni-input class="r">
              <div class="uni-input-wrapper">
                <input
				  :placeholder='$t("withdraw.Please enter")'
                  maxlength="140"
                  step=""
                  enterkeyhint="done"
                  autocomplete="off"
                  type="password"
                  class="uni-input-input"
                  :value="password"
                  @input="onKeyInput('password', $event)"
                />
              </div>
            </uni-input>
          </uni-view>
        </uni-view>
        <uni-view class="redMsg"
          >{{$t("withdraw.Reminder: Please check the payment information carefully, and this")}}
          {{$t("withdraw.withdrawal will deduct")}} {{requires}}% {{$t("withdraw.of the handling fee")}}</uni-view
        >
        <uni-view class="goSubmit" @click="confirmWithdrawal"
          >{{$t("withdraw.Confirm withdrawal")}}</uni-view
        >
      </uni-view>
    </uni-page-body>
  </uni-page-wrapper>
</template>

<script>
import service from '@/store/service.js'

import uniPopup from "../../components/uni-popup/uni-popup";
import uniPopupDialog from "../../components/uni-popup-dialog/uni-popup-dialog";


export default {
  components: { uniPopup, uniPopupDialog },

  data() {
    return {
      requires: '',
      withdrawalAmount: "",
      bank: "",
      accountNo: "",
      name: "",
      ifscCode: "",
      popup2Title: this.$t("withdraw.Are you sure you want to apply for withdrawal?"),
      password:'',
	  popupTitle:this.$t("withdraw.You have not bound a bank card"),
	  bd:this.$t("withdraw.Whether to go to bind?")
    };
  },
  onShow() {
  	service.auth(this,service.api.app_getbank,{},function(self,res){
		if(!res.data){
			self.$refs.popup.open();
		}
		self.name = res.data.nickname
		self.accountNo = res.data.bankcard
		self.bank = res.data.bankname
		self.ifscCode = res.data.zdname
		self.requires = res.put_charge
	})
  },
  methods: {
    onKeyInput(type, event) {
      this[type] = event.target.value;
    },
    confirmWithdrawal() {
      this.$refs.popup2.open();
    },
    close(done) {
      done();
	  uni.reLaunch({
		url:'/pages/me/me'
	  })
    },
	close2(done) {
		done();
	},
    confirm2(done, value) {
      //确定支付了/确定要去支付
      done();
      uni.showLoading();
	  service.auth(this,service.api.app_withdrawal,{
		  jypassword: this.password,
		  money: this.withdrawalAmount
	  },function(self,res){
		  uni.hideLoading()
		  uni.reLaunch({
		  	url:'/pages/home/home'
		  })
	  })
    },
    confirm(done, value) {
      //确定支付了/确定要去支付
      done();
	  uni.navigateTo({
		url:'/pages/bank/addbank'
	  })
    },
  },
};
</script>

<style>
@import url(./withDraw.css);
</style>